<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <style>
       
    </style>
</head>

<body>
   <table cellspacing="0" border="1px solid" style="text-align: center;">
    <thead>
       <tr>
        <td style="background-color: gray;width:50px"> 姓名</td>
        <td style="background-color: gray;width: 100px;">科目</td>
        <td style="background-color: gray; width: 60px;">成绩</td>
        <td style="background-color: gray;width: 100px;">操作</td>
       </tr>
    </thead>
    
   </table>
</body>
<script>
    let table=document.querySelector('table')
    for(let i=0;i<5;i++){
       let tr= document.createElement('tr')
       let td1=document.createElement('td')
       td1.innerHTML='姓名'+i;
       tr.appendChild(td1)
       let td2=document.createElement('td')
       td2.innerHTML='科目'+i;
       tr.appendChild(td2)
       let td3=document.createElement('td')
       td3.innerHTML='成绩'+i;
       tr.appendChild(td3)
       let td4=document.createElement('td')
       td4.innerHTML=`<a href='javascript:;'>删除</a>`;
       tr.appendChild(td4)
        table.appendChild(tr)
    }
    let as=table.querySelectorAll('a')
    for(let a of as){
        a.onclick= function () {
            console.log(this.parentNode.parentNode)
           let node= this.parentNode.parentNode
        //    通过父元素删除子元素
           table.removeChild(node)
        }
    }
</script>

</html>